



<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=2">
<meta name="theme-color" content="#FFF">
  <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png">

<link rel="icon" type="image/ico" sizes="32x32" href="/images/favicon.ico">
  <meta http-equiv="Cache-Control" content="no-transform">
  <meta http-equiv="Cache-Control" content="no-siteapp">


<link rel="alternate" type="application/rss+xml" title="逸尘" href="https://yichenm.github.io.git/rss.xml" />
<link rel="alternate" type="application/atom+xml" title="逸尘" href="https://yichenm.github.io.git/atom.xml" />
<link rel="alternate" type="application/json" title="逸尘" href="https://yichenm.github.io.git/feed.json" />

<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Mulish:300,300italic,400,400italic,700,700italic%7CFredericka%20the%20Great:300,300italic,400,400italic,700,700italic%7CNoto%20Serif%20JP:300,300italic,400,400italic,700,700italic%7CNoto%20Serif%20SC:300,300italic,400,400italic,700,700italic%7CInconsolata:300,300italic,400,400italic,700,700italic&display=swap&subset=latin,latin-ext">

<link rel="stylesheet" href="/css/app.css?v=0.2.5">

  
  <meta name="keywords" content="Hexo,教程" />


<link rel="canonical" href="https://yichenm.github.io.git/2020/08/13/computer-science/note/theme-shoka-doc/config/">


<meta name="description" content="🚀快速开始 - 💌依赖插件 - 📌基本配置 - 🌈界面显示 - 🦄特殊功能  # 站点别称 alternate: Yume Shoka这里设置的名称代替 Logo，显示在页面顶部，以及页尾©️处 # 静态文件目录 statics: &#x2F; #&#x2F;&#x2F;cdn.jsdelivr.net&#x2F;gh&#x2F;amehime&#x2F;shoka@latest&#x2F;默认值是 &#x2F; ，指使用本地静态文件 可以修改成 &#x2F;&#x2F;cdn.js">
<meta property="og:type" content="article">
<meta property="og:title" content="Step.2 基本配置">
<meta property="og:url" content="https://yichenm.github.io.git/2020/08/13/computer-science/note/theme-shoka-doc/config/index.html">
<meta property="og:site_name" content="逸尘">
<meta property="og:description" content="🚀快速开始 - 💌依赖插件 - 📌基本配置 - 🌈界面显示 - 🦄特殊功能  # 站点别称 alternate: Yume Shoka这里设置的名称代替 Logo，显示在页面顶部，以及页尾©️处 # 静态文件目录 statics: &#x2F; #&#x2F;&#x2F;cdn.jsdelivr.net&#x2F;gh&#x2F;amehime&#x2F;shoka@latest&#x2F;默认值是 &#x2F; ，指使用本地静态文件 可以修改成 &#x2F;&#x2F;cdn.js">
<meta property="og:locale" content="zh_CN">
<meta property="article:published_time" content="2020-08-13T12:56:48.000Z">
<meta property="article:modified_time" content="2020-11-10T20:12:45.000Z">
<meta property="article:author" content="逸尘">
<meta property="article:tag" content="Hexo">
<meta property="article:tag" content="教程">
<meta name="twitter:card" content="summary">


  <title>
Step.2 基本配置 - Theme Shoka Documentation - 二进制杂谈 - 计算机科学 |
Yi Chen = 逸尘 = 逸尘の博客</title>
<meta name="generator" content="Hexo 5.4.0"></head>
<body itemscope itemtype="http://schema.org/WebPage">
  <div id="loading">
    <div class="cat">
      <div class="body"></div>
      <div class="head">
        <div class="face"></div>
      </div>
      <div class="foot">
        <div class="tummy-end"></div>
        <div class="bottom"></div>
        <div class="legs left"></div>
        <div class="legs right"></div>
      </div>
      <div class="paw">
        <div class="hands left"></div>
        <div class="hands right"></div>
      </div>
    </div>
  </div>
  <div id="container">
    <header id="header" itemscope itemtype="http://schema.org/WPHeader">
      <div class="inner">
        <div id="brand">
          <div class="pjax">
          
  <h1 itemprop="name headline">Step.2 基本配置
  </h1>
  
<div class="meta">
  <span class="item" title="创建时间：2020-08-13 20:56:48">
    <span class="icon">
      <i class="ic i-calendar"></i>
    </span>
    <span class="text">发表于</span>
    <time itemprop="dateCreated datePublished" datetime="2020-08-13T20:56:48+08:00">2020-08-13</time>
  </span>
</div>


          </div>
        </div>
        <nav id="nav">
  <div class="inner">
    <div class="toggle">
      <div class="lines" aria-label="切换导航栏">
        <span class="line"></span>
        <span class="line"></span>
        <span class="line"></span>
      </div>
    </div>
    <ul class="menu">
      <li class="item title"><a href="/" rel="start">Yi Chen</a></li>
    </ul>
    <ul class="right">
      <li class="item theme">
        <i class="ic i-sun"></i>
      </li>
      <li class="item search">
        <i class="ic i-search"></i>
      </li>
    </ul>
  </div>
</nav>

      </div>
      <div id="imgs" class="pjax">
        <ul>
          <li class="item" data-background-image="https://tva1.sinaimg.cn/large/6833939bly1gicitzannuj20zk0m8b29.jpg"></li>
          <li class="item" data-background-image="https://tva1.sinaimg.cn/large/6833939bly1giclfb3vzhj20zk0m8wny.jpg"></li>
          <li class="item" data-background-image="https://tva1.sinaimg.cn/large/6833939bly1giclg5ms2rj20zk0m8u0x.jpg"></li>
          <li class="item" data-background-image="https://tva1.sinaimg.cn/large/6833939bly1giclx29mstj20zk0m8hdt.jpg"></li>
          <li class="item" data-background-image="https://tva1.sinaimg.cn/large/6833939bly1gipey84bjtj20zk0m8hdt.jpg"></li>
          <li class="item" data-background-image="https://tva1.sinaimg.cn/large/6833939bly1gicli9lfebj20zk0m84qp.jpg"></li>
        </ul>
      </div>
    </header>
    <div id="waves">
      <svg class="waves" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 24 150 28" preserveAspectRatio="none" shape-rendering="auto">
        <defs>
          <path id="gentle-wave" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z" />
        </defs>
        <g class="parallax">
          <use xlink:href="#gentle-wave" x="48" y="0" />
          <use xlink:href="#gentle-wave" x="48" y="3" />
          <use xlink:href="#gentle-wave" x="48" y="5" />
          <use xlink:href="#gentle-wave" x="48" y="7" />
        </g>
      </svg>
    </div>
    <main>
      <div class="inner">
        <div id="main" class="pjax">
          
  <div class="article wrap">
    
<div class="breadcrumb" itemscope itemtype="https://schema.org/BreadcrumbList">
<i class="ic i-home"></i>
<span><a href="/">首页</a></span><i class="ic i-angle-right"></i>
<span  itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"><a href="/categories/computer-science/" itemprop="item" rel="index" title="分类于 计算机科学"><span itemprop="name">计算机科学</span></a>
<meta itemprop="position" content="1" /></span>
<i class="ic i-angle-right"></i>
<span  itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"><a href="/categories/computer-science/note/" itemprop="item" rel="index" title="分类于 二进制杂谈"><span itemprop="name">二进制杂谈</span></a>
<meta itemprop="position" content="2" /></span>
<i class="ic i-angle-right"></i>
<span  class="current" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"><a href="/categories/computer-science/note/Theme-Shoka-Documentation/" itemprop="item" rel="index" title="分类于 Theme Shoka Documentation"><span itemprop="name">Theme Shoka Documentation</span></a>
<meta itemprop="position" content="3" /></span>
</div>

    <article itemscope itemtype="http://schema.org/Article" class="post block" lang="zh-CN">
  <link itemprop="mainEntityOfPage" href="https://yichenm.github.io.git/2020/08/13/computer-science/note/theme-shoka-doc/config/">

  <span hidden itemprop="author" itemscope itemtype="http://schema.org/Person">
    <meta itemprop="image" content="/images/avatar.jpg">
    <meta itemprop="name" content="逸尘">
    <meta itemprop="description" content="逸尘の博客, 专注于编程,分享生活,分享知识">
  </span>

  <span hidden itemprop="publisher" itemscope itemtype="http://schema.org/Organization">
    <meta itemprop="name" content="逸尘">
  </span>

  <div class="body md" itemprop="articleBody">
    

    <div class="note primary">
<p><a href="/computer-science/note/theme-shoka-doc/">🚀快速开始</a> - <a href="/computer-science/note/theme-shoka-doc/dependents/">💌依赖插件</a> - <a href="/computer-science/note/theme-shoka-doc/config/"><strong>📌基本配置</strong></a> - <a href="/computer-science/note/theme-shoka-doc/display/">🌈界面显示</a> - <a href="/computer-science/note/theme-shoka-doc/special/">🦄特殊功能</a></p>
</div>
<h1 id="站点别称"><a class="anchor" href="#站点别称">#</a> 站点别称</h1>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">alternate</span><span class="token punctuation">:</span> Yume Shoka</pre></td></tr></table></figure><p>这里设置的名称代替 Logo，显示在页面顶部，以及页尾©️处</p>
<h1 id="静态文件目录"><a class="anchor" href="#静态文件目录">#</a> 静态文件目录</h1>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">statics</span><span class="token punctuation">:</span> / <span class="token comment">#//cdn.jsdelivr.net/gh/amehime/shoka@latest/</span></pre></td></tr></table></figure><p>默认值是 <code>/</code> ，指使用本地静态文件<br />
可以修改成 <code>//cdn.jsdelivr.net/gh/您的github用户名/您的项目名@latest/</code>  这种形式，以使用 jsDelivr 进行加速。<br />
PS：jsDelivr 并不是实时更新，重新生成文件后需要耐心等待</p>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">css</span><span class="token punctuation">:</span> css</pre></td></tr><tr><td data-num="2"></td><td><pre><span class="token key atrule">js</span><span class="token punctuation">:</span> js</pre></td></tr><tr><td data-num="3"></td><td><pre><span class="token key atrule">images</span><span class="token punctuation">:</span> images</pre></td></tr></table></figure><p>静态文件所处目录的实际目录名，这些一般不改。</p>
<h1 id="夜间模式"><a class="anchor" href="#夜间模式">#</a> 夜间模式</h1>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">darkmode</span><span class="token punctuation">:</span> <span class="token comment"># true</span></pre></td></tr></table></figure><p>默认情况下，是否开启夜间模式取决于（优先级从高到低）：</p>
<ol>
<li>访客点击页面头部切换按钮的自行选择</li>
<li>访客切换了浏览设备的主题色调</li>
<li>您的 <code>darkmode</code>  配置项</li>
</ol>
<h1 id="自动定位"><a class="anchor" href="#自动定位">#</a> 自动定位</h1>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">auto_scroll</span><span class="token punctuation">:</span> <span class="token comment"># false</span></pre></td></tr></table></figure><p>默认情况下，再次打开页面时，会自动滚动到上次浏览的位置。<br />
这个选项设为 <code>false</code>  时将停用此功能。</p>
<h1 id="加载动画"><a class="anchor" href="#加载动画">#</a> 加载动画</h1>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token comment"># 是否显示页面加载动画 loading-cat</span></pre></td></tr><tr><td data-num="2"></td><td><pre><span class="token key atrule">loader</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="3"></td><td><pre>  <span class="token key atrule">start</span><span class="token punctuation">:</span> <span class="token boolean important">true</span> <span class="token comment"># 当初次打开页面时，显示加载动画</span></pre></td></tr><tr><td data-num="4"></td><td><pre>  <span class="token key atrule">switch</span><span class="token punctuation">:</span> <span class="token boolean important">true</span> <span class="token comment"># tab 切换到其他页面时，显示加载动画</span></pre></td></tr></table></figure><p>tab 切换后只是显示 loading 动画，实际并未重新加载页面</p>
<h1 id="页面特效"><a class="anchor" href="#页面特效">#</a> 页面特效</h1>
<p>单击页面的烟花效果配置如下</p>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">fireworks</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="2"></td><td><pre>  <span class="token key atrule">enable</span><span class="token punctuation">:</span> <span class="token boolean important">true</span> <span class="token comment"># 是否启用</span></pre></td></tr><tr><td data-num="3"></td><td><pre>  <span class="token key atrule">color</span><span class="token punctuation">:</span> <span class="token comment"># 烟花颜色</span></pre></td></tr><tr><td data-num="4"></td><td><pre>    <span class="token punctuation">-</span> <span class="token string">"rgba(255,182,185,.9)"</span></pre></td></tr><tr><td data-num="5"></td><td><pre>    <span class="token punctuation">-</span> <span class="token string">"rgba(250,227,217,.9)"</span></pre></td></tr><tr><td data-num="6"></td><td><pre>    <span class="token punctuation">-</span> <span class="token string">"rgba(187,222,214,.9)"</span></pre></td></tr><tr><td data-num="7"></td><td><pre>    <span class="token punctuation">-</span> <span class="token string">"rgba(138,198,209,.9)"</span></pre></td></tr></table></figure><h1 id="加载谷歌字体"><a class="anchor" href="#加载谷歌字体">#</a> 加载谷歌字体</h1>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">font</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="2"></td><td><pre>  <span class="token key atrule">enable</span><span class="token punctuation">:</span> <span class="token boolean important">true</span></pre></td></tr><tr><td data-num="3"></td><td><pre>  <span class="token comment"># Font options:</span></pre></td></tr><tr><td data-num="4"></td><td><pre>  <span class="token comment"># `external: true` will load this font family from `host` above.</span></pre></td></tr><tr><td data-num="5"></td><td><pre>  <span class="token comment"># `family: Times New Roman`. Without any quotes.</span></pre></td></tr><tr><td data-num="6"></td><td><pre>  <span class="token comment"># `size: x.x`. Use `em` as unit. Default: 1 (16px)</span></pre></td></tr><tr><td data-num="7"></td><td><pre></pre></td></tr><tr><td data-num="8"></td><td><pre>  <span class="token comment"># Global font settings used for all elements inside &lt;body>.</span></pre></td></tr><tr><td data-num="9"></td><td><pre>  <span class="token key atrule">global</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="10"></td><td><pre>    <span class="token key atrule">external</span><span class="token punctuation">:</span> <span class="token boolean important">true</span></pre></td></tr><tr><td data-num="11"></td><td><pre>    <span class="token key atrule">family</span><span class="token punctuation">:</span> Mulish</pre></td></tr><tr><td data-num="12"></td><td><pre>    <span class="token key atrule">size</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="13"></td><td><pre></pre></td></tr><tr><td data-num="14"></td><td><pre>  <span class="token comment"># Font settings for alternate title.</span></pre></td></tr><tr><td data-num="15"></td><td><pre>  <span class="token key atrule">logo</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="16"></td><td><pre>    <span class="token key atrule">external</span><span class="token punctuation">:</span> <span class="token boolean important">true</span></pre></td></tr><tr><td data-num="17"></td><td><pre>    <span class="token key atrule">family</span><span class="token punctuation">:</span> Fredericka the Great</pre></td></tr><tr><td data-num="18"></td><td><pre>    <span class="token key atrule">size</span><span class="token punctuation">:</span> <span class="token number">3.5</span></pre></td></tr><tr><td data-num="19"></td><td><pre></pre></td></tr><tr><td data-num="20"></td><td><pre>  <span class="token comment"># Font settings for site title.</span></pre></td></tr><tr><td data-num="21"></td><td><pre>  <span class="token key atrule">title</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="22"></td><td><pre>    <span class="token key atrule">external</span><span class="token punctuation">:</span> <span class="token boolean important">true</span></pre></td></tr><tr><td data-num="23"></td><td><pre>    <span class="token key atrule">family</span><span class="token punctuation">:</span> Noto Serif JP</pre></td></tr><tr><td data-num="24"></td><td><pre>    <span class="token key atrule">size</span><span class="token punctuation">:</span> <span class="token number">2.5</span></pre></td></tr><tr><td data-num="25"></td><td><pre></pre></td></tr><tr><td data-num="26"></td><td><pre>  <span class="token comment"># Font settings for headlines (&lt;h1> to &lt;h6>).</span></pre></td></tr><tr><td data-num="27"></td><td><pre>  <span class="token key atrule">headings</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="28"></td><td><pre>    <span class="token key atrule">external</span><span class="token punctuation">:</span> <span class="token boolean important">true</span></pre></td></tr><tr><td data-num="29"></td><td><pre>    <span class="token key atrule">family</span><span class="token punctuation">:</span> Noto Serif SC</pre></td></tr><tr><td data-num="30"></td><td><pre>    <span class="token key atrule">size</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="31"></td><td><pre></pre></td></tr><tr><td data-num="32"></td><td><pre>  <span class="token comment"># Font settings for posts.</span></pre></td></tr><tr><td data-num="33"></td><td><pre>  <span class="token key atrule">posts</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="34"></td><td><pre>    <span class="token key atrule">external</span><span class="token punctuation">:</span> <span class="token boolean important">true</span></pre></td></tr><tr><td data-num="35"></td><td><pre>    <span class="token key atrule">family</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="36"></td><td><pre></pre></td></tr><tr><td data-num="37"></td><td><pre>  <span class="token comment"># Font settings for &lt;code> and code blocks.</span></pre></td></tr><tr><td data-num="38"></td><td><pre>  <span class="token key atrule">codes</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="39"></td><td><pre>    <span class="token key atrule">external</span><span class="token punctuation">:</span> <span class="token boolean important">true</span></pre></td></tr><tr><td data-num="40"></td><td><pre>    <span class="token key atrule">family</span><span class="token punctuation">:</span> Inconsolata</pre></td></tr></table></figure><p>此功能基本参考 NexT。<br />
加粗标题的字体总是使用 <code>Noto Serif</code> ，为了正确友好的显示日文中的汉字，会先后加载 <code>headings</code>  和 <code>title</code>  的字体设置。</p>
<h1 id="iconfont图标"><a class="anchor" href="#iconfont图标">#</a>  <code>iconfont</code>  图标</h1>
<p>主题没有直接使用 Font Awesome，是因为用不到那么多 icon 感觉非常浪费，因此在 Iconfont 上重新建立了一个项目。<br />
 <code>font-family</code>  设为 <code>ic</code> ，所有字体样式前缀为 <code>i-</code> ，具体参见 <code>&lt;root&gt;/themes/shoka/source/css/_iconfont.styl</code> 。</p>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token comment"># project of https://www.iconfont.cn/</span></pre></td></tr><tr><td data-num="2"></td><td><pre><span class="token comment"># //at.alicdn.com/t/font_1832207_c8i9n1ulxlt.css => 1832207_c8i9n1ulxlt</span></pre></td></tr><tr><td data-num="3"></td><td><pre><span class="token key atrule">iconfont</span><span class="token punctuation">:</span> <span class="token string">"1832207_c8i9n1ulxlt"</span></pre></td></tr></table></figure><p>如果需要添加或修改，请留言告诉我您的<span class="exturl" data-url="aHR0cHM6Ly93d3cuaWNvbmZvbnQuY24v"> Iconfont</span> 用户名，我将把您添加到目前的<span class="exturl" data-url="aHR0cHM6Ly93d3cuaWNvbmZvbnQuY24vbWFuYWdlL2luZGV4P21hbmFnZV90eXBlPW15cHJvamVjdHMmYW1wO3Byb2plY3RJZD0xODMyMjA3">项目</span>中。</p>
<p>添加权限为 <code>只读</code> ，此后您可以任意全选，批量保存到购物车中，添加至您自己的项目里，并将主题配置文件中的 <code>iconfont</code>  值改为您的项目。</p>
<p>注意，您的项目应设置 <code>FontClass/Symbol 前缀</code> 为 <code>i-</code> 。</p>
<p>在 <code>&lt;root&gt;/source/_data/</code>  目录新建文件 <code>iconfont.styl</code> ，把新增或修改的图标样式复制到这个文件中。</p>
<blockquote>
<p>自定义 <code>iconfont.styl</code>  文件将覆盖主题默认样式，为了避免出错，请保证原有样式名均存在，在原有样式基础上进行增删改。</p>
</blockquote>
<h1 id="菜单与社交按钮"><a class="anchor" href="#菜单与社交按钮">#</a> 菜单与社交按钮</h1>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">menu</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="2"></td><td><pre>  <span class="token key atrule">home</span><span class="token punctuation">:</span> / <span class="token punctuation">|</span><span class="token punctuation">|</span> home</pre></td></tr><tr><td data-num="3"></td><td><pre>  <span class="token key atrule">about</span><span class="token punctuation">:</span> /about/ <span class="token punctuation">|</span><span class="token punctuation">|</span> user</pre></td></tr><tr><td data-num="4"></td><td><pre>  <span class="token key atrule">posts</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="5"></td><td><pre>    <span class="token key atrule">default</span><span class="token punctuation">:</span> / <span class="token punctuation">|</span><span class="token punctuation">|</span> feather</pre></td></tr><tr><td data-num="6"></td><td><pre>    <span class="token key atrule">archives</span><span class="token punctuation">:</span> /archives/ <span class="token punctuation">|</span><span class="token punctuation">|</span> list<span class="token punctuation">-</span>alt</pre></td></tr><tr><td data-num="7"></td><td><pre>    <span class="token key atrule">categories</span><span class="token punctuation">:</span> /categories/ <span class="token punctuation">|</span><span class="token punctuation">|</span> th</pre></td></tr><tr><td data-num="8"></td><td><pre>    <span class="token key atrule">tags</span><span class="token punctuation">:</span> /tags/ <span class="token punctuation">|</span><span class="token punctuation">|</span> tags</pre></td></tr><tr><td data-num="9"></td><td><pre>  <span class="token comment"># friends: /friends/ || heart</span></pre></td></tr><tr><td data-num="10"></td><td><pre>  <span class="token comment"># links: /links/ || magic</span></pre></td></tr><tr><td data-num="11"></td><td><pre></pre></td></tr><tr><td data-num="12"></td><td><pre><span class="token key atrule">social</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="13"></td><td><pre>  <span class="token key atrule">github</span><span class="token punctuation">:</span> https<span class="token punctuation">:</span>//github.com/yourname <span class="token punctuation">|</span><span class="token punctuation">|</span> github <span class="token punctuation">|</span><span class="token punctuation">|</span> "<span class="token comment">#191717"</span></pre></td></tr><tr><td data-num="14"></td><td><pre>  <span class="token comment">#google: https://plus.google.com/yourname || google</span></pre></td></tr><tr><td data-num="15"></td><td><pre>  <span class="token key atrule">twitter</span><span class="token punctuation">:</span> https<span class="token punctuation">:</span>//twitter.com/yourname <span class="token punctuation">|</span><span class="token punctuation">|</span> twitter <span class="token punctuation">|</span><span class="token punctuation">|</span> "<span class="token comment">#00aff0"</span></pre></td></tr><tr><td data-num="16"></td><td><pre>  <span class="token key atrule">zhihu</span><span class="token punctuation">:</span> https<span class="token punctuation">:</span>//www.zhihu.com/people/yourname <span class="token punctuation">|</span><span class="token punctuation">|</span> zhihu <span class="token punctuation">|</span><span class="token punctuation">|</span> "<span class="token comment">#1e88e5"</span></pre></td></tr><tr><td data-num="17"></td><td><pre>  <span class="token key atrule">music</span><span class="token punctuation">:</span> https<span class="token punctuation">:</span>//music.163.com/<span class="token comment">#/user/home?id=yourid || cloud-music || "#e60026"</span></pre></td></tr><tr><td data-num="18"></td><td><pre>  <span class="token key atrule">weibo</span><span class="token punctuation">:</span> https<span class="token punctuation">:</span>//weibo.com/yourname <span class="token punctuation">|</span><span class="token punctuation">|</span> weibo <span class="token punctuation">|</span><span class="token punctuation">|</span> "<span class="token comment">#ea716e"</span></pre></td></tr><tr><td data-num="19"></td><td><pre>  <span class="token key atrule">about</span><span class="token punctuation">:</span> https<span class="token punctuation">:</span>//about.me/yourname <span class="token punctuation">|</span><span class="token punctuation">|</span> address<span class="token punctuation">-</span>card <span class="token punctuation">|</span><span class="token punctuation">|</span> "<span class="token comment">#3b5998"</span></pre></td></tr><tr><td data-num="20"></td><td><pre>  <span class="token comment">#email: mailto:yourname@mail.com || envelope || "#55acd5"</span></pre></td></tr><tr><td data-num="21"></td><td><pre>  <span class="token comment">#facebook: https://www.facebook.com/yourname || facebook</span></pre></td></tr><tr><td data-num="22"></td><td><pre>  <span class="token comment">#stackoverflow: https://stackoverflow.com/yourname || stack-overflow</span></pre></td></tr><tr><td data-num="23"></td><td><pre>  <span class="token comment">#youtube: https://youtube.com/yourname || youtube</span></pre></td></tr><tr><td data-num="24"></td><td><pre>  <span class="token comment">#instagram: https://instagram.com/yourname || instagram</span></pre></td></tr><tr><td data-num="25"></td><td><pre>  <span class="token comment">#skype: skype:yourname?call|chat || skype</span></pre></td></tr><tr><td data-num="26"></td><td><pre>  <span class="token comment">#douban: https://www.douban.com/people/yourname/ || douban</span></pre></td></tr></table></figure><p>如上，使用 <code>||</code>  作为分隔符，依次为  <code>链接 || 图标 || 颜色</code> 。<br />
注意，只需要写图标名称，如 <code>github</code> ，则会自动转换为 <code>ic i-github</code> 。<br />
十六进制颜色码需要 <code>&quot;&quot;</code>  包绕。</p>
<p><code>menu</code>  支持一级子目录，子目录设置中的第一项必须为 <code>default</code> ，用来定义父级按钮的样式。</p>
<p>菜单显示文字可以在语言包中定义，<a href="../display/#%E8%87%AA%E5%AE%9A%E4%B9%89%E8%AF%AD%E8%A8%80%E5%8C%85">具体请戳这里</a></p>
<h1 id="边栏配置"><a class="anchor" href="#边栏配置">#</a> 边栏配置</h1>
<p>边栏可以选择在左侧，或右侧<br />
修改头像文件的地址，相对于静态文件目录 <code>images</code>  中配置的路径。</p>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">sidebar</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="2"></td><td><pre>  <span class="token comment"># Sidebar Position.</span></pre></td></tr><tr><td data-num="3"></td><td><pre>  <span class="token key atrule">position</span><span class="token punctuation">:</span> left</pre></td></tr><tr><td data-num="4"></td><td><pre>  <span class="token comment">#position: right</span></pre></td></tr><tr><td data-num="5"></td><td><pre>  <span class="token comment"># Replace the default avatar image and set the url here.</span></pre></td></tr><tr><td data-num="6"></td><td><pre>  <span class="token key atrule">avatar</span><span class="token punctuation">:</span> avatar.jpg</pre></td></tr></table></figure><p>可以将自己的图片放在 <code>&lt;root&gt;/source/_data/images/</code>  目录，甚至以同名覆盖主题内默认的头像图片，<a href="../display/#%E8%87%AA%E5%AE%9A%E4%B9%89%E4%B8%BB%E9%A2%98%E5%9B%BE%E7%89%87">具体请戳这里</a></p>
<h1 id="底部widgets"><a class="anchor" href="#底部widgets">#</a> 底部 widgets</h1>
<p>目前页面底部可以显示两个小部件，即 <code>随机文章</code> 和 <code>最近评论</code> 。</p>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">widgets</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="2"></td><td><pre>  <span class="token key atrule">random_posts</span><span class="token punctuation">:</span> <span class="token boolean important">true</span> <span class="token comment"># 显示随机文章</span></pre></td></tr><tr><td data-num="3"></td><td><pre>  <span class="token key atrule">recent_comments</span><span class="token punctuation">:</span> <span class="token boolean important">true</span> <span class="token comment"># 显示最近评论</span></pre></td></tr></table></figure><h1 id="字数及阅读时间统计"><a class="anchor" href="#字数及阅读时间统计">#</a> 字数及阅读时间统计</h1>
<p>安装好 <code>hexo-symbols-count-time</code>  插件后，不需要修改站点配置文件，直接使用插件默认配置就行。</p>
<p>需要修改主题配置文件，找到两处 <code>cout</code> ，修改为 <code>true</code> ：</p>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token comment"># 页尾全站统计</span></pre></td></tr><tr><td data-num="2"></td><td><pre><span class="token key atrule">footer</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="3"></td><td><pre>  <span class="token key atrule">since</span><span class="token punctuation">:</span> <span class="token number">2010</span></pre></td></tr><tr><td data-num="4"></td><td><pre>  <span class="token key atrule">count</span><span class="token punctuation">:</span> <span class="token boolean important">true</span></pre></td></tr><tr><td data-num="5"></td><td><pre></pre></td></tr><tr><td data-num="6"></td><td><pre><span class="token comment"># 文章界面统计</span></pre></td></tr><tr><td data-num="7"></td><td><pre><span class="token key atrule">post</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="8"></td><td><pre>  <span class="token key atrule">count</span><span class="token punctuation">:</span> <span class="token boolean important">true</span></pre></td></tr></table></figure><h1 id="文章评论"><a class="anchor" href="#文章评论">#</a> 文章评论</h1>
<p><span class="exturl" data-url="aHR0cHM6Ly92YWxpbmUuanMub3JnL3F1aWNrc3RhcnQuaHRtbA==">如何获取 LeanCloud 的 appId 和 appKey</span>。</p>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">valine</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="2"></td><td><pre>  <span class="token key atrule">appId</span><span class="token punctuation">:</span> <span class="token comment">#Your_appId</span></pre></td></tr><tr><td data-num="3"></td><td><pre>  <span class="token key atrule">appKey</span><span class="token punctuation">:</span> <span class="token comment">#Your_appkey</span></pre></td></tr><tr><td data-num="4"></td><td><pre>  <span class="token key atrule">placeholder</span><span class="token punctuation">:</span> ヽ(○´∀`)ﾉ♪ <span class="token comment"># Comment box placeholder</span></pre></td></tr><tr><td data-num="5"></td><td><pre>  <span class="token key atrule">avatar</span><span class="token punctuation">:</span> mp <span class="token comment"># Gravatar style : mp, identicon, monsterid, wavatar, robohash, retro</span></pre></td></tr><tr><td data-num="6"></td><td><pre>  <span class="token key atrule">pageSize</span><span class="token punctuation">:</span> <span class="token number">10</span> <span class="token comment"># Pagination size</span></pre></td></tr><tr><td data-num="7"></td><td><pre>  <span class="token key atrule">lang</span><span class="token punctuation">:</span> zh<span class="token punctuation">-</span>CN</pre></td></tr><tr><td data-num="8"></td><td><pre>  <span class="token key atrule">visitor</span><span class="token punctuation">:</span> <span class="token boolean important">true</span> <span class="token comment"># 文章访问量统计</span></pre></td></tr><tr><td data-num="9"></td><td><pre>  <span class="token key atrule">NoRecordIP</span><span class="token punctuation">:</span> <span class="token boolean important">false</span> <span class="token comment"># 不记录 IP</span></pre></td></tr><tr><td data-num="10"></td><td><pre>  <span class="token key atrule">serverURLs</span><span class="token punctuation">:</span> <span class="token comment"># When the custom domain name is enabled, fill it in here (it will be detected automatically by default, no need to fill in)</span></pre></td></tr><tr><td data-num="11"></td><td><pre>  <span class="token key atrule">powerMode</span><span class="token punctuation">:</span> <span class="token boolean important">true</span> <span class="token comment"># 默认打开评论框输入特效</span></pre></td></tr><tr><td data-num="12"></td><td><pre>  <span class="token key atrule">tagMeta</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="13"></td><td><pre>    <span class="token key atrule">visitor</span><span class="token punctuation">:</span> 新朋友</pre></td></tr><tr><td data-num="14"></td><td><pre>    <span class="token key atrule">master</span><span class="token punctuation">:</span> 主人</pre></td></tr><tr><td data-num="15"></td><td><pre>    <span class="token key atrule">friend</span><span class="token punctuation">:</span> 小伙伴</pre></td></tr><tr><td data-num="16"></td><td><pre>    <span class="token key atrule">investor</span><span class="token punctuation">:</span> 金主粑粑</pre></td></tr><tr><td data-num="17"></td><td><pre>  <span class="token key atrule">tagColor</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="18"></td><td><pre>    <span class="token key atrule">master</span><span class="token punctuation">:</span> <span class="token string">"var(--color-orange)"</span></pre></td></tr><tr><td data-num="19"></td><td><pre>    <span class="token key atrule">friend</span><span class="token punctuation">:</span> <span class="token string">"var(--color-aqua)"</span></pre></td></tr><tr><td data-num="20"></td><td><pre>    <span class="token key atrule">investor</span><span class="token punctuation">:</span> <span class="token string">"var(--color-pink)"</span></pre></td></tr><tr><td data-num="21"></td><td><pre>  <span class="token key atrule">tagMember</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="22"></td><td><pre>    <span class="token key atrule">master</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="23"></td><td><pre>      <span class="token comment"># - hash of master@email.com</span></pre></td></tr><tr><td data-num="24"></td><td><pre>      <span class="token comment"># - hash of master2@email.com</span></pre></td></tr><tr><td data-num="25"></td><td><pre>    <span class="token key atrule">friend</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="26"></td><td><pre>      <span class="token comment"># - hash of friend@email.com</span></pre></td></tr><tr><td data-num="27"></td><td><pre>      <span class="token comment"># - hash of friend2@email.com</span></pre></td></tr><tr><td data-num="28"></td><td><pre>    <span class="token key atrule">investor</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="29"></td><td><pre>      <span class="token comment"># - hash of investor1@email.com</span></pre></td></tr></table></figure><p>tag 标签显示在评论者名字的后面，默认是 <code>tagMeta.visitor</code>  对应的值。<br />
在 <code>tagMeta</code>  和 <code>tagColor</code>  中，除了 <code>visitor</code>  这个 key 不能修改外，其他 key 都可以换一换，但需要保证一致性。</p>
<figure class="highlight yml"><figcaption data-lang="YAML"><span>举个栗子</span></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">tagMeta</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="2"></td><td><pre>    <span class="token key atrule">visitor</span><span class="token punctuation">:</span> 游客</pre></td></tr><tr><td data-num="3"></td><td><pre>    <span class="token key atrule">admin</span><span class="token punctuation">:</span> 管理员</pre></td></tr><tr><td data-num="4"></td><td><pre>    <span class="token key atrule">waifu</span><span class="token punctuation">:</span> 我老婆</pre></td></tr><tr><td data-num="5"></td><td><pre>  <span class="token key atrule">tagColor</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="6"></td><td><pre>    <span class="token key atrule">visitor</span><span class="token punctuation">:</span> <span class="token string">"#855194"</span></pre></td></tr><tr><td data-num="7"></td><td><pre>    <span class="token key atrule">admin</span><span class="token punctuation">:</span> <span class="token string">"#a77c59"</span></pre></td></tr><tr><td data-num="8"></td><td><pre>    <span class="token key atrule">waifu</span><span class="token punctuation">:</span> <span class="token string">"#ed6ea0"</span></pre></td></tr><tr><td data-num="9"></td><td><pre>  <span class="token key atrule">tagMember</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="10"></td><td><pre>    <span class="token key atrule">admin</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="11"></td><td><pre>      <span class="token comment"># - hash of admin@email.com</span></pre></td></tr><tr><td data-num="12"></td><td><pre>    <span class="token key atrule">waifu</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="13"></td><td><pre>      <span class="token comment"># - hash of waifu@email.com</span></pre></td></tr></table></figure><p>在文章 Front Matter 中也可以配置上述参数，访问该文章页面时，将覆盖全局配置。<br />
尤其可以用来配置一个特殊的 placeholder。</p>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">valine</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="2"></td><td><pre>  <span class="token key atrule">placeholder</span><span class="token punctuation">:</span> <span class="token string">"1. 提问前请先仔细阅读本文档⚡\n2. 页面显示问题💥，请提供控制台截图📸或者您的测试网址\n3. 其他任何报错💣，请提供详细描述和截图📸，祝食用愉快💪"</span></pre></td></tr><tr><td data-num="3"></td><td><pre><span class="token punctuation">---</span></pre></td></tr></table></figure><p>评论通知与管理工具建议使用这个<span class="exturl" data-url="aHR0cHM6Ly9naXRodWIuY29tL0Rlc2VydHNQL1ZhbGluZS1BZG1pbg=="> Valine-Admin</span>。<br />
注意 <code>SITE_URL</code>  需要以 <code>/</code>  结尾。</p>
<p>如果某一篇文章需要关闭评论功能，则在文章 Front Matter 中配置：</p>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token punctuation">---</span></pre></td></tr><tr><td data-num="2"></td><td><pre><span class="token key atrule">title</span><span class="token punctuation">:</span> 关闭评论</pre></td></tr><tr><td data-num="3"></td><td><pre><span class="token key atrule">comment</span><span class="token punctuation">:</span> <span class="token boolean important">false</span></pre></td></tr><tr><td data-num="4"></td><td><pre><span class="token punctuation">---</span></pre></td></tr></table></figure><h1 id="背景音乐"><a class="anchor" href="#背景音乐">#</a> 背景音乐</h1>
<p>在主题配置文件中，设置全局播放列表。<br />
在文章的 Front Matter 中，设置文章专有播放列表，访问该文章页面时，将覆盖全局配置。</p>
<figure class="highlight yml"><figcaption data-lang="YAML"><span>单列表</span></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">audio</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="2"></td><td><pre>  <span class="token punctuation">-</span> https<span class="token punctuation">:</span>//music.163.com/song<span class="token punctuation">?</span>id=1387098940</pre></td></tr><tr><td data-num="3"></td><td><pre>  <span class="token punctuation">-</span> https<span class="token punctuation">:</span>//music.163.com/<span class="token comment">#/playlist?id=2088001742</span></pre></td></tr><tr><td data-num="4"></td><td><pre>  <span class="token punctuation">-</span> https<span class="token punctuation">:</span>//www.xiami.com/collect/250830668</pre></td></tr><tr><td data-num="5"></td><td><pre>  <span class="token punctuation">-</span> https<span class="token punctuation">:</span>//y.qq.com/n/yqq/playsquare/3535982902.html</pre></td></tr></table></figure><p>如上，可以直接使用网易云、虾米、QQ 音乐的播放列表、单曲，可以同时填写多个。</p>
<figure class="highlight yml"><figcaption data-lang="YAML"><span>多列表</span></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">audio</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="2"></td><td><pre>  <span class="token punctuation">-</span> <span class="token key atrule">title</span><span class="token punctuation">:</span> 列表1</pre></td></tr><tr><td data-num="3"></td><td><pre>    <span class="token key atrule">list</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="4"></td><td><pre>      <span class="token punctuation">-</span> https<span class="token punctuation">:</span>//music.163.com/<span class="token comment">#/playlist?id=2943811283</span></pre></td></tr><tr><td data-num="5"></td><td><pre>      <span class="token punctuation">-</span> https<span class="token punctuation">:</span>//music.163.com/<span class="token comment">#/playlist?id=2297706586</span></pre></td></tr><tr><td data-num="6"></td><td><pre>  <span class="token punctuation">-</span> <span class="token key atrule">title</span><span class="token punctuation">:</span> 列表2</pre></td></tr><tr><td data-num="7"></td><td><pre>    <span class="token key atrule">list</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="8"></td><td><pre>      <span class="token punctuation">-</span> https<span class="token punctuation">:</span>//music.163.com/<span class="token comment">#/playlist?id=2031842656</span></pre></td></tr></table></figure><p>如果需要自定义媒体文件，可以按照以下格式填写：</p>
<figure class="highlight yml"><figcaption data-lang="YAML"><span>单列表</span></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">audio</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="2"></td><td><pre>  <span class="token punctuation">-</span> <span class="token key atrule">name</span><span class="token punctuation">:</span> <span class="token string">"曲目1"</span></pre></td></tr><tr><td data-num="3"></td><td><pre>    <span class="token key atrule">url</span><span class="token punctuation">:</span> <span class="token string">"播放地址"</span></pre></td></tr><tr><td data-num="4"></td><td><pre>    <span class="token key atrule">artist</span><span class="token punctuation">:</span> <span class="token string">"艺术家"</span></pre></td></tr><tr><td data-num="5"></td><td><pre>    <span class="token key atrule">cover</span><span class="token punctuation">:</span> <span class="token string">"封面"</span></pre></td></tr><tr><td data-num="6"></td><td><pre>    <span class="token key atrule">lrc</span><span class="token punctuation">:</span> <span class="token string">"歌词"</span></pre></td></tr><tr><td data-num="7"></td><td><pre>  <span class="token punctuation">-</span> <span class="token key atrule">name</span><span class="token punctuation">:</span> <span class="token string">"曲目2"</span></pre></td></tr><tr><td data-num="8"></td><td><pre>    <span class="token key atrule">url</span><span class="token punctuation">:</span> <span class="token string">"播放地址"</span></pre></td></tr><tr><td data-num="9"></td><td><pre>    <span class="token key atrule">artist</span><span class="token punctuation">:</span> <span class="token string">"艺术家"</span></pre></td></tr><tr><td data-num="10"></td><td><pre>    <span class="token key atrule">cover</span><span class="token punctuation">:</span> <span class="token string">"封面"</span></pre></td></tr><tr><td data-num="11"></td><td><pre>    <span class="token key atrule">lrc</span><span class="token punctuation">:</span> <span class="token string">"歌词"</span></pre></td></tr></table></figure><figure class="highlight yml"><figcaption data-lang="YAML"><span>多列表</span></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">audio</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="2"></td><td><pre>    <span class="token punctuation">-</span> <span class="token key atrule">title</span><span class="token punctuation">:</span> 列表1</pre></td></tr><tr><td data-num="3"></td><td><pre>      <span class="token key atrule">list</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="4"></td><td><pre>        <span class="token punctuation">-</span> <span class="token key atrule">name</span><span class="token punctuation">:</span> <span class="token string">"曲目1"</span></pre></td></tr><tr><td data-num="5"></td><td><pre>          <span class="token key atrule">url</span><span class="token punctuation">:</span> <span class="token string">"播放地址"</span></pre></td></tr><tr><td data-num="6"></td><td><pre>          <span class="token key atrule">artist</span><span class="token punctuation">:</span> <span class="token string">"艺术家"</span></pre></td></tr><tr><td data-num="7"></td><td><pre>          <span class="token key atrule">cover</span><span class="token punctuation">:</span> <span class="token string">"封面"</span></pre></td></tr><tr><td data-num="8"></td><td><pre>          <span class="token key atrule">lrc</span><span class="token punctuation">:</span> <span class="token string">"歌词"</span></pre></td></tr><tr><td data-num="9"></td><td><pre>        <span class="token punctuation">-</span> <span class="token key atrule">name</span><span class="token punctuation">:</span> <span class="token string">"曲目2"</span></pre></td></tr><tr><td data-num="10"></td><td><pre>          <span class="token key atrule">url</span><span class="token punctuation">:</span> <span class="token string">"播放地址"</span></pre></td></tr><tr><td data-num="11"></td><td><pre>          <span class="token key atrule">artist</span><span class="token punctuation">:</span> <span class="token string">"艺术家"</span></pre></td></tr><tr><td data-num="12"></td><td><pre>          <span class="token key atrule">cover</span><span class="token punctuation">:</span> <span class="token string">"封面"</span></pre></td></tr><tr><td data-num="13"></td><td><pre>          <span class="token key atrule">lrc</span><span class="token punctuation">:</span> <span class="token string">"歌词"</span></pre></td></tr><tr><td data-num="14"></td><td><pre>    <span class="token punctuation">-</span> <span class="token key atrule">title</span><span class="token punctuation">:</span> 列表2</pre></td></tr><tr><td data-num="15"></td><td><pre>      <span class="token key atrule">list</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="16"></td><td><pre>        <span class="token punctuation">-</span> https<span class="token punctuation">:</span>//music.163.com/<span class="token comment">#/playlist?id=2031842656</span></pre></td></tr></table></figure><p>如果要关闭当前页面的背景音乐播放器，则在文章 Front Matter 中配置：</p>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token punctuation">---</span></pre></td></tr><tr><td data-num="2"></td><td><pre><span class="token key atrule">title</span><span class="token punctuation">:</span> 关闭背景音乐</pre></td></tr><tr><td data-num="3"></td><td><pre><span class="token key atrule">audio</span><span class="token punctuation">:</span> <span class="token boolean important">false</span></pre></td></tr><tr><td data-num="4"></td><td><pre><span class="token punctuation">---</span></pre></td></tr></table></figure><h1 id="随机图库"><a class="anchor" href="#随机图库">#</a> 随机图库</h1>
<ul>
<li>
<p>默认的图片列表位于 <code>&lt;root&gt;/themes/shoka/_images.yml</code>  中。<br />
使用了渣浪图库，使用一些上传工具，比如<span class="exturl" data-url="aHR0cHM6Ly9waWMuZ2ltaG95LmNvbS8=">这里</span><br />
上传后图片的链接是 <code>http://wx4.sinaimg.cn/large/6833939bly1gicmnywqgpj20zk0m8dwx.jpg</code> 。<br />
只需要新一行写上 <code>- 6833939bly1gicmnywqgpj20zk0m8dwx.jpg</code> 。</p>
<p>如果想要自定义，则在 <code>&lt;root&gt;/source/_data/</code>  目录新建一个 <code>images.yml</code>  文件，这个文件中的图片至少 6 枚，将完全覆盖默认的图片列表。</p>
</li>
<li>
<p>也可以直接在图片列表 yml 文件中，写上任意外链图片地址</p>
</li>
</ul>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token punctuation">-</span> https<span class="token punctuation">:</span>//i.loli.net/2020/10/30/qAMYEFXxJcKRsiG.gif</pre></td></tr><tr><td data-num="2"></td><td><pre><span class="token punctuation">-</span> https<span class="token punctuation">:</span>//i.loli.net/2020/10/30/rjdhcSgEN8COBPA.jpg</pre></td></tr><tr><td data-num="3"></td><td><pre><span class="token punctuation">-</span> https<span class="token punctuation">:</span>//i.loli.net/2020/10/30/HKyzSd7NI3mlBpt.jpg</pre></td></tr><tr><td data-num="4"></td><td><pre><span class="token punctuation">-</span> https<span class="token punctuation">:</span>//i.loli.net/2020/10/30/Y1CBXqgeokEs457.jpg</pre></td></tr><tr><td data-num="5"></td><td><pre><span class="token punctuation">-</span> https<span class="token punctuation">:</span>//i.loli.net/2020/10/30/Z5W6r2BSoiThHG1.jpg</pre></td></tr></table></figure><ul>
<li>也可以在主题配置文件中，设置图床 API：</li>
</ul>
<figure class="highlight yml"><figcaption data-lang="YAML"><span>比如</span></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">image_server</span><span class="token punctuation">:</span> <span class="token string">"https://acg.xydwz.cn/api/api.php"</span></pre></td></tr></table></figure><h1 id="加载第三方组件"><a class="anchor" href="#加载第三方组件">#</a> 加载第三方组件</h1>
<figure class="highlight yml"><figcaption data-lang="YAML"></figcaption><table><tr><td data-num="1"></td><td><pre><span class="token key atrule">vendors</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="2"></td><td><pre>  <span class="token key atrule">css</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="3"></td><td><pre>    <span class="token comment"># 略略略</span></pre></td></tr><tr><td data-num="4"></td><td><pre>  <span class="token key atrule">js</span><span class="token punctuation">:</span></pre></td></tr><tr><td data-num="5"></td><td><pre>    <span class="token comment"># 略略略</span></pre></td></tr></table></figure><p>包括</p>
<table>
<tbody>
<tr>
<td><code>pace</code></td>
<td>加载进度条</td>
<td>全局</td>
</tr>
<tr>
<td><code>pjax</code></td>
<td>页面无刷新加载</td>
<td>全局</td>
</tr>
<tr>
<td><code>anime</code></td>
<td>js 动画效果</td>
<td>全局</td>
</tr>
<tr>
<td><code>algolia</code>   <code>instantsearch</code></td>
<td>基于 algolia 的站内搜索</td>
<td>全局</td>
</tr>
<tr>
<td><code>lazyload</code></td>
<td>图片懒加载</td>
<td>全局</td>
</tr>
<tr>
<td><code>quicklink</code></td>
<td>链接资源预加载</td>
<td>全局</td>
</tr>
<tr>
<td><code>fetch</code></td>
<td>获取播放列表</td>
<td>全局</td>
</tr>
<tr>
<td><code>katex</code>   <code>copy_tex</code></td>
<td>数学公式显示及复制</td>
<td>按需</td>
</tr>
<tr>
<td><code>fancybox</code></td>
<td>图片放大显示及排列</td>
<td>按需</td>
</tr>
<tr>
<td><code>valine</code></td>
<td>基于 LeanCloud 的评论系统及文章阅读次数统计</td>
<td>按需</td>
</tr>
<tr>
<td><code>chart</code></td>
<td>图表显示</td>
<td>按需</td>
</tr>
</tbody>
</table>
<p>以上文件加载全部基于 jsDelivr，并对全局加载的组件进行了文件合并。<br />
如果不明白啥意思，则不要轻易修改。</p>
<div class="note danger">
<p>主题版本升级的时候，可能会修改这里。<br />
如果修改过主题默认 <code>_config.yml</code> ，记得更新主题时，末尾的 <code>vendors</code>  也要及时修改。</p>
</div>

      <div class="tags">
          <a href="/tags/Hexo/" rel="tag"><i class="ic i-tag"></i> Hexo</a>
          <a href="/tags/%E6%95%99%E7%A8%8B/" rel="tag"><i class="ic i-tag"></i> 教程</a>
      </div>
  </div>

   <footer>

    <div class="meta">
  <span class="item">
    <span class="icon">
      <i class="ic i-calendar-check"></i>
    </span>
    <span class="text">更新于</span>
    <time title="修改时间：2020-11-11 04:12:45" itemprop="dateModified" datetime="2020-11-11T04:12:45+08:00">2020-11-11</time>
  </span>
</div>

      
<div class="reward">
  <button><i class="ic i-heartbeat"></i> 赞赏</button>
  <p>请我喝[茶]~(￣▽￣)~*</p>
  <div id="qr">
      
      <div>
        <img data-src="/images/wechatpay.png" alt="逸尘 微信支付">
        <p>微信支付</p>
      </div>
      
      <div>
        <img data-src="/images/alipay.png" alt="逸尘 支付宝">
        <p>支付宝</p>
      </div>
      
      <div>
        <img data-src="/images/paypal.png" alt="逸尘 贝宝">
        <p>贝宝</p>
      </div>
  </div>
</div>

      

<div id="copyright">
<ul>
  <li class="author">
    <strong>本文作者： </strong>逸尘 <i class="ic i-at"><em>@</em></i>逸尘
  </li>
  <li class="link">
    <strong>本文链接：</strong>
    <a href="https://yichenm.github.io.git/2020/08/13/computer-science/note/theme-shoka-doc/config/" title="Step.2 基本配置">https://yichenm.github.io.git/2020/08/13/computer-science/note/theme-shoka-doc/config/</a>
  </li>
  <li class="license">
    <strong>版权声明： </strong>本站所有文章除特别声明外，均采用 <span class="exturl" data-url="aHR0cHM6Ly9jcmVhdGl2ZWNvbW1vbnMub3JnL2xpY2Vuc2VzL2J5LW5jLXNhLzQuMC9kZWVkLnpo"><i class="ic i-creative-commons"><em>(CC)</em></i>BY-NC-SA</span> 许可协议。转载请注明出处！
  </li>
</ul>
</div>

  </footer>

</article>

  </div>
  

<div class="post-nav">
    <div class="item left">
      

  <a href="/2020/08/13/computer-science/note/theme-shoka-doc/dependents/" itemprop="url" rel="prev" data-background-image="https:&#x2F;&#x2F;tva1.sinaimg.cn&#x2F;mw690&#x2F;6833939bly1giciuja1j1j20zk0m8kjl.jpg" title="Step.1 依赖插件">
  <span class="type">上一篇</span>
  <span class="category"><i class="ic i-flag"></i> Theme Shoka Documentation</span>
  <h3>Step.1 依赖插件</h3>
  </a>

    </div>
    <div class="item right">
      

  <a href="/2020/08/13/computer-science/note/theme-shoka-doc/display/" itemprop="url" rel="next" data-background-image="https:&#x2F;&#x2F;tva1.sinaimg.cn&#x2F;mw690&#x2F;6833939bly1giciusoyjnj219g0u0x56.jpg" title="Step.3 界面显示">
  <span class="type">下一篇</span>
  <span class="category"><i class="ic i-flag"></i> Theme Shoka Documentation</span>
  <h3>Step.3 界面显示</h3>
  </a>

    </div>
</div>

  
  <div class="wrap" id="comments"></div>


        </div>
        <div id="sidebar">
          

<div class="inner">

  <div class="panels">
    <div class="inner">
      <div class="contents panel pjax" data-title="文章目录">
          <ol class="toc"><li class="toc-item toc-level-1"><a class="toc-link" href="#%E7%AB%99%E7%82%B9%E5%88%AB%E7%A7%B0"><span class="toc-number">1.</span> <span class="toc-text"> 站点别称</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E9%9D%99%E6%80%81%E6%96%87%E4%BB%B6%E7%9B%AE%E5%BD%95"><span class="toc-number">2.</span> <span class="toc-text"> 静态文件目录</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%A4%9C%E9%97%B4%E6%A8%A1%E5%BC%8F"><span class="toc-number">3.</span> <span class="toc-text"> 夜间模式</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E8%87%AA%E5%8A%A8%E5%AE%9A%E4%BD%8D"><span class="toc-number">4.</span> <span class="toc-text"> 自动定位</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%8A%A0%E8%BD%BD%E5%8A%A8%E7%94%BB"><span class="toc-number">5.</span> <span class="toc-text"> 加载动画</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E9%A1%B5%E9%9D%A2%E7%89%B9%E6%95%88"><span class="toc-number">6.</span> <span class="toc-text"> 页面特效</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%8A%A0%E8%BD%BD%E8%B0%B7%E6%AD%8C%E5%AD%97%E4%BD%93"><span class="toc-number">7.</span> <span class="toc-text"> 加载谷歌字体</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#iconfont%E5%9B%BE%E6%A0%87"><span class="toc-number">8.</span> <span class="toc-text">  iconfont  图标</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E8%8F%9C%E5%8D%95%E4%B8%8E%E7%A4%BE%E4%BA%A4%E6%8C%89%E9%92%AE"><span class="toc-number">9.</span> <span class="toc-text"> 菜单与社交按钮</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E8%BE%B9%E6%A0%8F%E9%85%8D%E7%BD%AE"><span class="toc-number">10.</span> <span class="toc-text"> 边栏配置</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%BA%95%E9%83%A8widgets"><span class="toc-number">11.</span> <span class="toc-text"> 底部 widgets</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%AD%97%E6%95%B0%E5%8F%8A%E9%98%85%E8%AF%BB%E6%97%B6%E9%97%B4%E7%BB%9F%E8%AE%A1"><span class="toc-number">12.</span> <span class="toc-text"> 字数及阅读时间统计</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E6%96%87%E7%AB%A0%E8%AF%84%E8%AE%BA"><span class="toc-number">13.</span> <span class="toc-text"> 文章评论</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E8%83%8C%E6%99%AF%E9%9F%B3%E4%B9%90"><span class="toc-number">14.</span> <span class="toc-text"> 背景音乐</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E9%9A%8F%E6%9C%BA%E5%9B%BE%E5%BA%93"><span class="toc-number">15.</span> <span class="toc-text"> 随机图库</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%8A%A0%E8%BD%BD%E7%AC%AC%E4%B8%89%E6%96%B9%E7%BB%84%E4%BB%B6"><span class="toc-number">16.</span> <span class="toc-text"> 加载第三方组件</span></a></li></ol>
      </div>
      <div class="related panel pjax" data-title="系列文章">
        <ul>
          <li><a href="/2020/08/13/computer-science/note/theme-shoka-doc/" rel="bookmark" title="Hexo主题Shoka & multi-markdown-it渲染器使用说明">Hexo主题Shoka & multi-markdown-it渲染器使用说明</a></li><li><a href="/2020/08/13/computer-science/note/theme-shoka-doc/dependents/" rel="bookmark" title="Step.1 依赖插件">Step.1 依赖插件</a></li><li class="active"><a href="/2020/08/13/computer-science/note/theme-shoka-doc/config/" rel="bookmark" title="Step.2 基本配置">Step.2 基本配置</a></li><li><a href="/2020/08/13/computer-science/note/theme-shoka-doc/display/" rel="bookmark" title="Step.3 界面显示">Step.3 界面显示</a></li><li><a href="/2020/08/13/computer-science/note/theme-shoka-doc/special/" rel="bookmark" title="Step.4 主题特殊功能">Step.4 主题特殊功能</a></li>
        </ul>
      </div>
      <div class="overview panel" data-title="站点概览">
        <div class="author" itemprop="author" itemscope itemtype="http://schema.org/Person">
  <img class="image" itemprop="image" alt="逸尘"
      data-src="/images/avatar.jpg">
  <p class="name" itemprop="name">逸尘</p>
  <div class="description" itemprop="description">专注于编程,分享生活,分享知识</div>
</div>

<nav class="state">
    <div class="item posts">
      <a href="/archives/">
        <span class="count">25</span>
        <span class="name">文章</span>
      </a>
    </div>
    <div class="item categories">
      <a href="/categories/">
        <span class="count">13</span>
        <span class="name">分类</span>
      </a>
    </div>
    <div class="item tags">
      <a href="/tags/">
        <span class="count">17</span>
        <span class="name">标签</span>
      </a>
    </div>
</nav>

<div class="social">
      <span class="exturl item github" data-url="aHR0cHM6Ly9naXRodWIuY29tL3lpY2hlbm0=" title="https:&#x2F;&#x2F;github.com&#x2F;yichenm"><i class="ic i-github"></i></span>
      <span class="exturl item twitter" data-url="aHR0cHM6Ly90d2l0dGVyLmNvbS95b3VybmFtZQ==" title="https:&#x2F;&#x2F;twitter.com&#x2F;yourname"><i class="ic i-twitter"></i></span>
      <span class="exturl item zhihu" data-url="aHR0cHM6Ly93d3cuemhpaHUuY29tL3Blb3BsZS95b3VybmFtZQ==" title="https:&#x2F;&#x2F;www.zhihu.com&#x2F;people&#x2F;yourname"><i class="ic i-zhihu"></i></span>
      <span class="exturl item music" data-url="aHR0cHM6Ly9tdXNpYy4xNjMuY29tLyMvdXNlci9ob21lP2lkPXlvdXJpZA==" title="https:&#x2F;&#x2F;music.163.com&#x2F;#&#x2F;user&#x2F;home?id&#x3D;yourid"><i class="ic i-cloud-music"></i></span>
      <span class="exturl item weibo" data-url="aHR0cHM6Ly93ZWliby5jb20veW91cm5hbWU=" title="https:&#x2F;&#x2F;weibo.com&#x2F;yourname"><i class="ic i-weibo"></i></span>
      <span class="exturl item qq" data-url="aHR0cDovL3dwYS5xcS5jb20vbXNncmQ/dj0zJnVpbj0xNjYwNTk3MzcwJnNpdGU9cXEmbWVudT15ZXM=" title="http:&#x2F;&#x2F;wpa.qq.com&#x2F;msgrd?v&#x3D;3&amp;uin&#x3D;1660597370&amp;site&#x3D;qq&amp;menu&#x3D;yes"><i class="ic i-qq"></i></span>
</div>

<ul class="menu">
  
    
  <li class="item">
    <a href="/" rel="section"><i class="ic i-home"></i>首页</a>
  </li>

    
  <li class="item">
    <a href="/about/" rel="section"><i class="ic i-user"></i>关于</a>
  </li>

    
  <li class="item">
    <a href="/friends/" rel="section"><i class="ic i-heart"></i>友達</a>
  </li>

    
  <li class="item">
    <a href="/links/" rel="section"><i class="ic i-magic"></i>链接</a>
  </li>

    
  <li class="item">
    <a href="/musics/" rel="section"><i class="ic i-music"></i>音乐</a>
  </li>

    
  <li class="item">
    <a href="/movies/" rel="section"><i class="ic i-sakura"></i>视频</a>
  </li>

        
  <li class="item dropdown">
      <a href="javascript:void(0);"><i class="ic i-feather"></i>文章</a>
    <ul class="submenu">

        
  <li class="item">
    <a href="/archives/" rel="section"><i class="ic i-list-alt"></i>归档</a>
  </li>

        
  <li class="item">
    <a href="/categories/" rel="section"><i class="ic i-th"></i>分类</a>
  </li>

        
  <li class="item">
    <a href="/tags/" rel="section"><i class="ic i-tags"></i>标签</a>
  </li>

  </ul>

</ul>

      </div>
    </div>
  </div>

  <ul id="quick">
    <li class="prev pjax">
        <a href="/2020/08/13/computer-science/note/theme-shoka-doc/dependents/" rel="prev" title="上一篇"><i class="ic i-chevron-left"></i></a>
    </li>
    <li class="up"><i class="ic i-arrow-up"></i></li>
    <li class="down"><i class="ic i-arrow-down"></i></li>
    <li class="next pjax">
        <a href="/2020/08/13/computer-science/note/theme-shoka-doc/display/" rel="next" title="下一篇"><i class="ic i-chevron-right"></i></a>
    </li>
    <li class="percent"></li>
  </ul>
</div>


        </div>
        <div class="dimmer"></div>
      </div>
    </main>
    <footer id="footer">
      <div class="inner">
        <div class="widgets">
          
<div class="rpost pjax">
  <h2>随机文章</h2>
  <ul>
      
  <li class="item">
    
<div class="breadcrumb">
<a href="/categories/computer-science/" title="分类于 计算机科学">计算机科学</a>
<i class="ic i-angle-right"></i>
<a href="/categories/computer-science/java/" title="分类于 Java">Java</a>
<i class="ic i-angle-right"></i>
<a href="/categories/computer-science/java/%E9%9B%B6%E5%9F%BA%E7%A1%80%E5%AD%A6Java%E8%AF%AD%E8%A8%80/" title="分类于 零基础学Java语言-">零基础学Java语言-</a>
</div>

    <span><a href="/2021/08/24/computer-science/java/course-1/nodelibrary/" title="JavaSE实战项目图书管理系统">JavaSE实战项目图书管理系统</a></span>
  </li>

      
  <li class="item">
    
<div class="breadcrumb">
<a href="/categories/blog/" title="分类于 博客篇">博客篇</a>
</div>

    <span><a href="/2020/03/15/blog/PicGo-GitHub/" title="PicGo+GitHub 图床搭建">PicGo+GitHub 图床搭建</a></span>
  </li>

      
  <li class="item">
    
<div class="breadcrumb">
<a href="/categories/blog/" title="分类于 博客篇">博客篇</a>
</div>

    <span><a href="/2020/03/24/blog/Blog/" title="个人博客搭建">个人博客搭建</a></span>
  </li>

      
  <li class="item">
    
<div class="breadcrumb">
<a href="/categories/computer-science/" title="分类于 计算机科学">计算机科学</a>
<i class="ic i-angle-right"></i>
<a href="/categories/computer-science/java/" title="分类于 Java">Java</a>
<i class="ic i-angle-right"></i>
<a href="/categories/computer-science/java/course-1/" title="分类于 零基础学Java语言">零基础学Java语言</a>
<i class="ic i-angle-right"></i>
<a href="/categories/JavaSE%E7%AF%87/" title="分类于 JavaSE篇">JavaSE篇</a>
<i class="ic i-angle-right"></i>
<a href="/categories/%E7%BC%96%E7%A8%8B%E8%AF%AD%E8%A8%80/" title="分类于 编程语言">编程语言</a>
</div>

    <span><a href="/2020/04/20/computer-science/java/course-1/week3/" title="JavaSE基础知识点归纳总结">JavaSE基础知识点归纳总结</a></span>
  </li>

      
  <li class="item">
    
<div class="breadcrumb">
<a href="/categories/computer-science/" title="分类于 计算机科学">计算机科学</a>
<i class="ic i-angle-right"></i>
<a href="/categories/computer-science/java/" title="分类于 Java">Java</a>
<i class="ic i-angle-right"></i>
<a href="/categories/computer-science/java/%E9%9B%B6%E5%9F%BA%E7%A1%80%E5%AD%A6Java%E8%AF%AD%E8%A8%80/" title="分类于 零基础学Java语言-">零基础学Java语言-</a>
</div>

    <span><a href="/2020/04/12/computer-science/java/course-1/week-1/" title="第1周 计算">第1周 计算</a></span>
  </li>

      
  <li class="item">
    
<div class="breadcrumb">
<a href="/categories/computer-science/" title="分类于 计算机科学">计算机科学</a>
<i class="ic i-angle-right"></i>
<a href="/categories/computer-science/note/" title="分类于 二进制杂谈">二进制杂谈</a>
<i class="ic i-angle-right"></i>
<a href="/categories/computer-science/note/Theme-Shoka-Documentation/" title="分类于 Theme Shoka Documentation">Theme Shoka Documentation</a>
</div>

    <span><a href="/2020/08/13/computer-science/note/theme-shoka-doc/display/" title="Step.3 界面显示">Step.3 界面显示</a></span>
  </li>

      
  <li class="item">
    
<div class="breadcrumb">
<a href="/categories/Foo/" title="分类于 Foo">Foo</a>
<i class="ic i-angle-right"></i>
<a href="/categories/Foo/Bar/" title="分类于 Bar">Bar</a>
<i class="ic i-angle-right"></i>
<a href="/categories/Foo/Bar/Baz/" title="分类于 Baz">Baz</a>
</div>

    <span><a href="/2013/12/24/blog/categories/" title="Categories">Categories</a></span>
  </li>

      
  <li class="item">
    
<div class="breadcrumb">
<a href="/categories/%E5%89%8D%E7%AB%AF%E7%AF%87/" title="分类于 前端篇">前端篇</a>
</div>

    <span><a href="/2020/03/27/blog/jQuery+CSS3/" title="文字背景粒子特效">文字背景粒子特效</a></span>
  </li>

      
  <li class="item">
    
<div class="breadcrumb">
</div>

    <span><a href="/2013/12/24/blog/long-title/" title="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam justo turpis, tincidunt ac convallis id.">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam justo turpis, tincidunt ac convallis id.</a></span>
  </li>

      
  <li class="item">
    
<div class="breadcrumb">
<a href="/categories/blog/" title="分类于 博客篇">博客篇</a>
</div>

    <span><a href="/2020/06/20/blog/Hexo-xr/" title="Hexo之渲染绕过">Hexo之渲染绕过</a></span>
  </li>

  </ul>
</div>
<div>
  <h2>最新评论</h2>
  <ul class="leancloud-recent-comment"></ul>
</div>

        </div>
        <div class="status">
  <div class="copyright">
    
    &copy; 2020 – 
    <span itemprop="copyrightYear">2022</span>
    <span class="with-love">
      <i class="ic i-sakura rotate"></i>
    </span>
    <span class="author" itemprop="copyrightHolder">逸尘 @ Yi Chen</span>
    
  </div>
  <div class="powered-by">
    基于 <span class="exturl" data-url="aHR0cHM6Ly9oZXhvLmlv">Hexo</span> & Theme.<span class="exturl" data-url="aHR0cHM6Ly9naXRodWIuY29tL2FtZWhpbWUvaGV4by10aGVtZS1zaG9rYQ==">Shoka</span>
  </div>
  <div>
  <img src="https://static.dy208.cn/o_1dfilp8ruo521thr1hvf18ji17soa.png" style="display:inline-block" />
    <a href="https://beian.miit.gov.cn/"  style="color:#808080" target="_blank">鄂ICP备2021014555号-1</a>
  <div/>
</div>

      </div>
    </footer>
  </div>
<script data-config type="text/javascript">
  var LOCAL = {
    path: '2020/08/13/computer-science/note/theme-shoka-doc/config/',
    favicon: {
      show: "（●´3｀●）やれやれだぜ",
      hide: "(´Д｀)大変だ！"
    },
    search : {
      placeholder: "文章搜索",
      empty: "关于 「 ${query} 」，什么也没搜到",
      stats: "${time} ms 内找到 ${hits} 条结果"
    },
    valine: {"placeholder":"1. 提问前请先仔细阅读本文档⚡\n2. 页面显示问题💥，请提供控制台截图📸或者您的测试网址\n3. 其他任何报错💣，请提供详细描述和截图📸，祝食用愉快💪"},fancybox: true,copyright: '复制成功，转载请遵守 <i class="ic i-creative-commons"></i>BY-NC-SA 协议。',
    ignores : [
      function(uri) {
        return uri.includes('#');
      },
      function(uri) {
        return new RegExp(LOCAL.path+"$").test(uri);
      }
    ]
  };
</script>

<script src="https://cdn.polyfill.io/v2/polyfill.js"></script>

<script src="//cdn.jsdelivr.net/combine/npm/pace-js@1.0.2/pace.min.js,npm/pjax@0.2.8/pjax.min.js,npm/whatwg-fetch@3.4.0/dist/fetch.umd.min.js,npm/animejs@3.2.0/lib/anime.min.js,npm/algoliasearch@4/dist/algoliasearch-lite.umd.js,npm/instantsearch.js@4/dist/instantsearch.production.min.js,npm/lozad@1/dist/lozad.min.js,npm/quicklink@2/dist/quicklink.umd.js"></script>

<script src="/js/app.js?v=0.2.5"></script>




</body>
</html>
